<template>
  <a-list :grid="{ gutter: 16, xs: 1, sm: 2, md: 4, lg: 4, xl: 6, xxl: 3 }" :data-source="this.recordsdata">
    <a-list-item slot="renderItem" slot-scope="item, index" style="min-width: 400px">
      <a-card :title="'项目名称：'+item.projectName" :description="item.time" >
<!--        :class="! item.disable?'view1':'view2'"-->
          <a slot="extra" @click="showModal(item)" >紧急请假</a>
      </a-card>
      <a-modal
        title="请假原因"
        :visible="visible"
        @ok="postLeave"
        @cancel="handleCancel">
        <!--内容-->
        <a-textarea placeholder="请输入请假原因" :rows="4" v-model = "leaveCause"/>
      </a-modal>
      <a-modal
        :closable="false"
        :visible="isShow"
        title="温馨提示"
      >
        <p>您的信息已受理，请等待审核结果！</p>
        <template slot="footer">
          <a-button @click="handleOkss" style="background-color: #93adff;color: white">关闭</a-button>
        </template>
      </a-modal>
    </a-list-item>
  </a-list>
</template>
<script>
    import '@/assets/less/TableExpand.less'
    import {postAction} from '@/api/manage'
    import {getAction} from "../../api/manage";

    export default {
    data() {
      return {
        leaveCause:"",
        visible:false,
        recordsdata:"",
        itemdata:{},
        isShow:false,
        items:[{
          projectId:'',
          disabled:false,
        }],
        url: {
                list: "/projectProfessorInfo/listByProfessorId",
                query:"/projectProfessorInfo/queryByuserid",
                delete: "/projectProfessorInfo/delete",
                deleteBatch: "/projectProfessorInfo/deleteBatch",
                exportXlsUrl: "/projectProfessorInfo/exportXls",
                importExcelUrl: "/projectProfessorInfo/importExcel",
                randomChoose: "/projectProfessorInfo/randomChoose",
                queryProfessorNumber: "/projectProfessorInfo/queryProfessorNumber",
                toSendLeaveCause:"/sendLeaveCause",
              },
      };
    },
    mounted(){
      getAction(this.url.list).then((res) => {
        this.recordsdata=res.result.records;
            for (let i = 0; i < this.recordsdata.length; i++) {
              this.recordsdata[i].disable=false;
            }
            this.getDisable();
    })
    },
    methods: {
      getDisable(){
        getAction(this.url.query).then((res) => {
          console.log(res)
          for (let i = 0; i < res.result.length; i++) {
            for (let j = 0; j < this.recordsdata.length; j++) {
              if(this.recordsdata[j].id===res.result[i].projectId){
                if(res.result[i].urgentLeaveStatus===1){
                  this.recordsdata[j].disable=true;
                }
              }
            }
          }
          console.log("22")
          console.log(this.recordsdata)

        })
      },
      showModal(item) {
        // 显示请假框
        if(!item.disable){
          this.visible = true;
          this.itemdata=item;
          console.log(item);
        }else{
          this.isShow=true;
        }
      },
      handleOkss(){
        this.isShow=false;
      },
      handleCancel(){
        this.visible = false;
      },
      postLeave(){
        let params = {
          userId:this.itemdata.dingUserId,
          projectId:this.itemdata.id,
          leaveCause: this.leaveCause,
        }
        if(this.leaveCause===''){
          this.$message.warning("紧急请假的理由不能为空")
        }else {
          // axios发送到后端
          postAction(this.url.toSendLeaveCause,params).then((res)=>{
            if(res.success!=null){
              if (res.success){
                this.$message.success(res.message)
                location.reload()
              }else {
                this.$message.error(res.message)
              }
            }
          })
          this.itemdata=null;
          this.leaveCause="";
          this.visible = false;
        }
      }
    }
  };
</script>
<style >
.view1{
  float: right;
}
.view2{
  float: right;pointer-events: none;color: gray
}
</style>